import React from 'react'
import { View, Text, Image, Navigator } from '@tarojs/components'
import './index.scss'

interface IProps {
  setComment?: () => void
}

export default function CommentsList(props: IProps) {
  const setComment = () => {
    props.setComment && props.setComment()
  }
  return (
    <View className='comments-list'>
      <View className='comments-item'>
        <Image className='comments-avatar' src='https://636c-cloud1-6geivl0o33cc257c-1306297348.tcb.qcloud.la/avatar13.png?sign=89aea16a698bb35f1588c3d4c7c8099f&t=1642439178' mode='aspectFill'></Image>

        <View className='comments-main'>
          <View className='comments-head'>
            <View className='comments-head-info'>
              <View className='comments-head-user'>评论人</View>
              <View className='comments-head-time'>评论时间</View>
            </View>
            <View className='comments-star'>
              <Text className='iconfont icon-31dianzan'></Text>
              <Text>2</Text>
            </View>
          </View>

          <View className='comments-content' onClick={setComment}>评论内容</View>

          {/* 评论的回复 */}
          <View className='comments-reply-list'>
            <View className='comments-reply-item'>
              <Text className='comments-reply-user'>
              评论人
              <Text>回复：</Text>
              </Text>
              <Text className='comments-reply-content'>评论内容</Text>
            </View>

            {/* 更多评论的回复 */}
            <Navigator url="../../pages/tieCommentsReply/index?id=" className='comments-reply-show-all'>
              查看全部回复
              <Text className='iconfont icon-jiantouyou'></Text>
            </Navigator>
          </View>
        </View>
      </View>
    </View>
  )
}
